
#loginBox{
  width: 400px;
  height: 400px;
  margin: auto;
  position: absolute;
  top: 25%;
  left: 40%;

  #headPic {
    width: 200px;
    height: 200px;
    border: 1px solid red;
    border-radius: 50%;
    overflow: hidden;
    margin: auto;
    // margin-top: 200px;
    margin-bottom: 20px;
    transition: all linear 0.2s;
    img{
      width: 100%;
      height: 100%;
    }
  }
  
  #sj {
    opacity: 0;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 20px solid rgba(200, 200, 200, 0.4);
    margin: auto;
    transition: all linear 0.2s;
  }
  
  #formBox {
   opacity: 0;
    width: 400px;
    height: 400px;
    background-color: rgba(200, 200, 200, 0.4);
    margin: auto;
    border-radius: 20px;
    padding: 40px;
    transition: all linear 0.2s;
  }
}
#loginBox:hover{
  #headPic{
    width: 100px;
    height: 100px;
    // margin-top: 150px;
  }
  #sj,  
  #formBox {
    opacity: 1;
  }
}
.content{
  
  position: relative;
  width:100%;

  height:100%;



  background-color: #fff;

  background: url(../../assets/bg.png);

  background-repeat: no-repeat;

  background-size: cover;

}